{{use "jquery"}}
{{use "jqutils"}}
{{include "inc_paginate.html"}}
<script type="text/javascript">
  $(function(){
      var width = $(window).width() - 250;
      $('#content_main').width(width);
      var box_width = Math.min(width, $('#{{=table_id}}').width());
      $('#paginate').width(box_width);
  });
</script>

<div id="content_main" style="overflow-x:auto;padding-bottom:20px;">
{{include "inc_query.html"}}
{{<< table}}
<div id="paginate"></div>
<script type="text/javascript">
$(function(){
    $('#download').click(function(){
        var query_string = $.query_string.set('download', '', true).toString();
        $.download("{{=request.path}}" + query_string)
        return false;
    });
});

var load_content = function(page){
    page = page||1;
    var query_string = $.query_string.set('pageno', page, true).set('data', '', true).toString();
    $.ajax({
      type: 'POST',
      url: "{{=request.path}}" + query_string,
      dataType: 'json',
      success: function(data){
            $('#{{=table_id}}').find('tbody').html(data.table);
            create_pagination('#paginate', data.total, {{=settings.get_var('PARA/ROWS_PER_PAGE')}}, page, load_content);
        }
    });
}

$(function(){
    load_content();
});
</script>
</div>
